教你画中国地图和各省市地图

2024-06-03 18:14| 来源: 网络整理| 查看: 265

在做数据统计时，有时需要在对应地图上显示相关数据，例如足迹、医院数量等等，这里提供画中国地图（包括各个省），和各省地图（包括各个市）的代码点击获取代码

网友根据下面步骤制作的其他省份plist数据收集，目前已经提交git，可直接使用： 1、内蒙古后续若有其他省份的数据，感谢分享(qq:978159546)，方便其他人

效果如下：

步骤：一、获取地图数据

如下链接获取中国各省份绘制SVG地图数据

二、根据所需的数据，制作svg图这里我给一个广东省的svg图

下载地址

双击svg图片，可以发现它对应代码

可以发现里面每个子视图（市）对应一个封闭路径，最后拼成一个广东省地图。

这里写一个简单的例子

把上段代码粘贴到文本编辑器中，保存格式为svg，可得到如下图

制作对应省份的svg地图

简单一点，参考广东省的代码，把其中广东省的数据换成对应省份的数据，即可得到对应省份的地图

这里增加下替换具体步骤：

1、拿到第一步获取的地图数据，里面有各个省份的数据 2、打开我第二步给的广东省svg图片，双击打开，你会看到下图

3、看到没，不知道怎么写的，就在这里面，去掉广东省的数据，然后把你需要的数据粘贴到框框里，一个path是一个地区，有备注的 4、全部替换完成，保存就完成自己的svg制作。

这里感谢简友Bye_leon 提供获取svg更为简便的方法，通过这个工具,选择自己需要的区域。好处： 1、直接就可以下载到需要的SVG图了，也就是说你可以省下第一，二步。 2、可以制作市县级地图

三、得到地图之后，如果没有其他需求，已经可以通过第三方显示了

SVGKit

四、把地图中的数据转成UIBezierPath，然后保存到本地

这样做的原因：

地图基本不会变的，所以一次性生成数据文件并保存本地，以后直接读取文件即可可做对应的后续操作，例如点击后回调点击的区域名字五、通过PaintCode工具，把上面生成的svg地图拖入下面区域，调整对应的开发语言看到没：在代码区域已经生成了对应的UIBezierPath 六、把生成的 UIBezierPath存到一个数组中，并归档，生成guangDong.plist文件

注意：粘贴时，删除每个UIBezierPath对象的下面部分，这里在代码中统一配置

七、生成guangDongInfo.plist 这里面是什么呢？

我把制作广东省的这个文件代码粘贴出来就明白了

- (void)createInfo{ NSMutableArray *dataArr = [[NSMutableArray alloc] init]; CGRect rect1 = CGRectMake(0, 151.72, 60.14, 78.28); NSValue *value1 = [NSValue valueWithCGRect:rect1]; NSDictionary *dic1 = @{ @"name":@"湛江", @"index":@(1), @"rect":value1 }; [dataArr addObject:dic1]; CGRect rect2 = CGRectMake(28.71, 118.79, 55.98, 57.21); NSValue *value2 = [NSValue valueWithCGRect:rect2]; NSDictionary *dic2 = @{ @"name":@"茂名", @"index":@(2), @"rect":value2 }; [dataArr addObject:dic2]; CGRect rect3 = CGRectMake(68.32, 119.79, 45.14, 50.9); NSValue *value3 = [NSValue valueWithCGRect:rect3]; NSDictionary *dic3 = @{ @"name":@"阳江", @"index":@(3), @"rect":value3 }; [dataArr addObject:dic3]; CGRect rect4 = CGRectMake(59.21, 92.41, 60.57, 39.81); NSValue *value4 = [NSValue valueWithCGRect:rect4]; NSDictionary *dic4 = @{ @"name":@"云浮", @"index":@(4), @"rect":value4 }; [dataArr addObject:dic4]; CGRect rect5 = CGRectMake(98.39, 112.37, 51.89, 59.25); NSValue *value5 = [NSValue valueWithCGRect:rect5]; NSDictionary *dic5 = @{ @"name":@"江门", @"index":@(5), @"rect":value5 }; [dataArr addObject:dic5]; CGRect rect6 = CGRectMake(71.48, 47.05, 63.37, 68.77); NSValue *value6 = [NSValue valueWithCGRect:rect6]; NSDictionary *dic6 = @{ @"name":@"肇庆", @"index":@(6), @"rect":value6 }; [dataArr addObject:dic6]; CGRect rect7 = CGRectMake(114.33, 82.02, 41.48, 39.11); NSValue *value7 = [NSValue valueWithCGRect:rect7]; NSDictionary *dic7 = @{ @"name":@"佛山", @"index":@(7), @"rect":value7 }; [dataArr addObject:dic7]; CGRect rect8 = CGRectMake(95.24, 13.48, 82.39, 73.38); NSValue *value8 = [NSValue valueWithCGRect:rect8]; NSDictionary *dic8 = @{ @"name":@"清远", @"index":@(8), @"rect":value8 }; [dataArr addObject:dic8]; CGRect rect9 = CGRectMake(138.01, 66.96, 45.57, 59.48); NSValue *value9 = [NSValue valueWithCGRect:rect9]; NSDictionary *dic9 = @{ @"name":@"广州", @"index":@(9), @"rect":value9 }; [dataArr addObject:dic9]; CGRect rect10 = CGRectMake(146.19, 115.58, 22.32, 25.28); NSValue *value10 = [NSValue valueWithCGRect:rect10]; NSDictionary *dic10 = @{ @"name":@"中山", @"index":@(10), @"rect":value10 }; [dataArr addObject:dic10]; CGRect rect11 = CGRectMake(142.1, 129.24, 56.05, 28.25); NSValue *value11 = [NSValue valueWithCGRect:rect11]; NSDictionary *dic11 = @{ @"name":@"珠海", @"index":@(11), @"rect":value11 }; [dataArr addObject:dic11]; CGRect rect12 = CGRectMake(167.65, 112.55, 40.55, 25.74); NSValue *value12 = [NSValue valueWithCGRect:rect12]; NSDictionary *dic12 = @{ @"name":@"深圳", @"index":@(12), @"rect":value12 }; [dataArr addObject:dic12]; CGRect rect13 = CGRectMake(161.26, 100.06, 30.5, 20.61); NSValue *value13 = [NSValue valueWithCGRect:rect13]; NSDictionary *dic13 = @{ @"name":@"东莞", @"index":@(13), @"rect":value13 }; [dataArr addObject:dic13]; CGRect rect14 = CGRectMake(133.49, 0, 78.37, 68.59); NSValue *value14 = [NSValue valueWithCGRect:rect14]; NSDictionary *dic14 = @{ @"name":@"韶关", @"index":@(14), @"rect":value14 }; [dataArr addObject:dic14]; CGRect rect15 = CGRectMake(173.53, 65.56, 66.53, 66.96); NSValue *value15 = [NSValue valueWithCGRect:rect15]; NSDictionary *dic15 = @{ @"name":@"惠州", @"index":@(15), @"rect":value15 }; [dataArr addObject:dic15]; CGRect rect16 = CGRectMake(191.33, 31.06, 56.05, 67.83); NSValue *value16 = [NSValue valueWithCGRect:rect16]; NSDictionary *dic16 = @{ @"name":@"河源", @"index":@(16), @"rect":value16 }; [dataArr addObject:dic16]; CGRect rect17 = CGRectMake(219.11, 86.16, 54.18, 36.13); NSValue *value17 = [NSValue valueWithCGRect:rect17]; NSDictionary *dic17 = @{ @"name":@"汕尾", @"index":@(17), @"rect":value17 }; [dataArr addObject:dic17]; CGRect rect18 = CGRectMake(235.97, 24.28, 66.96, 66.08); NSValue *value18 = [NSValue valueWithCGRect:rect18]; NSDictionary *dic18 = @{ @"name":@"梅州", @"index":@(18), @"rect":value18 }; [dataArr addObject:dic18]; CGRect rect19 = CGRectMake(247.81, 73.44, 42.41, 39.11); NSValue *value19 = [NSValue valueWithCGRect:rect19]; NSDictionary *dic19 = @{ @"name":@"揭阳", @"index":@(19), @"rect":value19 }; [dataArr addObject:dic19]; CGRect rect20 = CGRectMake(279.25, 54.23, 34.66, 33.8); NSValue *value20 = [NSValue valueWithCGRect:rect20]; NSDictionary *dic20 = @{ @"name":@"潮州", @"index":@(20), @"rect":value20 }; [dataArr addObject:dic20]; CGRect rect21 = CGRectMake(274.73, 78.75, 45.57, 25.51); NSValue *value21 = [NSValue valueWithCGRect:rect21]; NSDictionary *dic21 = @{ @"name":@"汕头", @"index":@(21), @"rect":value21 }; [dataArr addObject:dic21]; NSString *document = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES)[0]; NSString *path = [document stringByAppendingPathComponent:@"guangdongName.plist"]; BOOL isSucc = [NSKeyedArchiver archiveRootObject:dataArr toFile:path]; if (isSucc) { NSLog(@"----成功"); }else{ NSLog(@"----失败"); } } 呐呐😋，走神了八、生成以上两个文件之后，导出这两个文件，以后就再也不会跑第二遍生成了 image.png

显示包内容

即将大功告成，把这两个文件导入项目，然后使用我写的这个画地图的工具类即可画出你需要的地图。好吧，我在最下面再给一次代码链接，有使用demo

点击这里

【本文地址】

公司简介

联系我们